<template>
	<view @touchmove.stop.prevent="">
		<u-popup bgColor="transparent" :show="show" mode="center"  >
			<view class="showVipPopup">
				<image src="http://cdn.yic3.cn/lawyer/mp-xhs/mine/icon13.png" class="logo" mode=""></image>
				<view class="top">
					<view class="">
						<view >{{urlAddress}}</view>
						<view @click="copyText(urlAddress)">复制</view>
					</view>
				</view>
				<image src="http://cdn.yic3.cn/lawyer/mp-xhs/mine/icon14.png" mode="widthFix"></image>
				<image src="http://cdn.yic3.cn/lawyer/mp-xhs/mine/icon11.png" mode="widthFix"></image>
				<image @click="cancel" src="http://cdn.yic3.cn/lawyer/byteDance/home/pop4.png" mode="widthFix"></image>
			</view>
		</u-popup>
	</view>
</template>

<script>
	import {mapState} from 'vuex'
	export default {
		name:"vipPopup",
		props:{
			
		},
		data() {
			return {
				urlAddress:'https://land.college.cbb6.cn'
			};
		},
		created() {
			this.urlAddress = uni.getStorageSync('config')['client.download.app.url'] || 'https://land.college.cbb6.cn'
		},
		computed:{
			...mapState({
				show:state=>state.vipAgree
			})
		},
		methods:{
			// 同意协议
			Agreement(){
				this.$store.commit('updateVipagree',false)
			},
			cancel(){
				this.$store.commit('updateVipagree',false)
			},
		}
	}
</script>

<style lang="scss">
	.showVipPopup{
		width: 576rpx;
		background-color: transparent !important;
		display: flex;
		flex-direction: column;
		position: relative;
		.logo{
			position: absolute;
			top: 150rpx;
			left: 0;
			right: 0;
			width: 220rpx;
			height: 291.34rpx;
			margin: 0 auto;
			z-index: 111;
		}
		.top{
			width: 576rpx;
			height:602rpx;
			background-image: url('http://cdn.yic3.cn/lawyer/mp-xhs/mine/icon12.png');
			background-size: 100% 100%;
			position: relative;
			
			>view{
				width: 100%;
				position: absolute;
				bottom: 24rpx;
				padding: 0 40rpx;
				box-sizing: border-box;
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: center;
				font-size: 24rpx;
				>view:nth-child(1){
					width: 502rpx;
					color:#fff;
					font-size: 26rpx;
					word-break: break-word;
					
				}
				>view:nth-child(2){
					font-weight: bold;
					width: 140rpx;
					height: 44rpx;
					background: rgba(255,255,255,0.07);
					border-radius: 78rpx 78rpx 78rpx 78rpx;
					text-align: center;
					line-height: 44rpx;
					color: #FFC700;
					font-size: 24rpx;
					margin-top: 18rpx;
				}
			}
		}
		>image:nth-child(3){
			width: 576rpx;
			height: 32rpx;
		}>image:nth-child(4){
			width: 576rpx;
			height: 198rpx;
		}>image:nth-child(5){
			margin: 0 auto;
			margin-top: 42rpx;
			width: 60rpx;
			height: 60rpx;
		}
	}

</style>